// 导入vue（注意：使用这种方式导入默认是 vue-runtime-only.js,不是完整版的vue.js）
import Vue from 'vue'

// 导入第三方模块
import vueRouter from 'vue-router'
import vueResource from 'vue-resource'
import VuePreview from 'vue-preview'
import Vuex from 'vuex'

// 安装使用 第三方模块
Vue.use(vueRouter)
Vue.use(vueResource)  // 安装完后每一个vue组件上就有了一个$http
// Vue.use(VuePreview)
Vue.use(VuePreview, {
    fullscreenEl: false,//关闭全屏按钮
    shareEl: false//取消分享按钮
})
Vue.use(Vuex)


// 导入自己的路由模块
import router from './route.js'

// 这里统一引入所有的Mnti-UI组件
import {Header, Swipe, SwipeItem, Button, Lazyload} from 'mint-ui';

// 注册使用 第三方的组件
// Vue.component(Header.name, Header)
// Vue.component(Swipe.name, Swipe);
// Vue.component(SwipeItem.name, SwipeItem);
// Vue.component(Button.name, Button);
// Vue.use(Lazyload);

//  如果使用懒加载，则必须使用完全导入的方式，才可以吧懒加载的图片给显示出来
//  如果使用 按需加载，则懒加载的滚动图标是无法加载和显示出来的
import MintUI from 'mint-ui'

import 'mint-ui/lib/style.css'

//  注册使用第三方插件
Vue.use(MintUI)


//  设置根路由
Vue.http.options.root = 'http://www.liulongbin.top:3005'
Vue.http.options.emulateJSON = true

// 定义全局的日期格式化器
Vue.filter('dateFormat', function (timeStr, pattern = 'YYYY-MM-DD HH:mm:ss') {
    return moment(timeStr).format(pattern)
})

// 这里用来引入所有的单文件组件
import app from './App.vue'

// 导入样式部分
import './lib/MUI/css/mui.min.css'
import './lib/MUI/css/icons-extra.css'
import moment from "moment";

// 在页面一被加载的时候，购物车中的内容就已经被加载了
let shopcart = JSON.parse(localStorage.getItem('cart') || '[]')

const store = new Vuex.Store({
    state: {
        carts: shopcart
    },
    mutations: {
        addToCart(state, cart) {
            let flag = false
            // 在这里state作为第一个参数传递进来，所以不需要使用this.$state来获取
            state.carts.some(item => {
                if (cart.id === item.id) {
                    flag = true
                    item.num += parseInt(cart.num)
                    return true
                }
            })

            if (!flag) {
                state.carts.push(cart)
            }

            // 把数据存储到localStorage中
            localStorage.setItem('cart', JSON.stringify(state.carts))
        },
        addCart(state, obj) {
            state.carts.some(item => {
                if (item.id === obj.id) {
                    item.num = parseInt(obj.num)
                    return true
                }
            })

            // 把数据存储到localStorage中
            localStorage.setItem('cart', JSON.stringify(state.carts))
        },
        delCart(state, id) {

            state.carts.some((item, i) => {
                if (parseInt(item.id) === id) {
                    return state.carts.splice(i, 1)
                }
            })
            localStorage.setItem('cart', JSON.stringify(state.carts))
        },
        changeState(state, obj) {
            state.carts.some(item => {
                if (parseInt(item.id) === obj.id) {
                    return item.selected = obj.selected
                }
            })
            localStorage.setItem('cart', JSON.stringify(state.carts))
        }
    },
    getters: {
        countCart(state) {
            let count = 0
            state.carts.forEach(item => {
                count += item.num
            })
            return count
        },
        getCount(state) {
            var obj = {}
            state.carts.forEach(item => {
                obj[item.id] = item.num
            })
            return obj
        },
        getStatus(state) {
            let o = {}
            state.carts.forEach(item => {
                o[item.id] = item.selected
            })
            return o
        },
        getTotal(state) {
            let obj = {
                count: 0,
                price: 0
            }

            state.carts.forEach(item => {
                if (item.selected === true) {
                    obj.count += item.num
                    obj.price += item.num * item.price
                }
            })
            return obj
        }
    }
})

var vm = new Vue({
    el: '#app',
    data: {},
    methods: {},
    render: c => c(app),
    router,
    store

})